
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="logo.css">
    <link rel="stylesheet" href="css/xinxi.css"/>
    <link rel="stylesheet" type="text/css" href="css/ly.css"/>
    <link rel="stylesheet" href="css/2.css">
    <link rel="stylesheet" href="css/1.css">
    <link rel="stylesheet" href="css/xun.css" />
    <link rel="stylesheet" href="css/guan.css" />
    <link rel="stylesheet" href="font_rubdaoifco1g7gb9/iconfont.css"></li>
    <script src="js/jquery-3.1.1.min.js"></script>

</head>
<body style="font-size: 14px;font-family:PingFangSC-Regular;">
      <div class="ql_footer">
       <div class="ql_fone">
         <p style="margin: 0 3px">LOGO</p>
           <p>有好牙后台管理系统</p>
           <div>
               <span>你好,王丽娜 </span>
               <span><a href="#">退出</a></span>
           </div>
       </div>
          <div class="ql_moster">
         <ul id="accordion" class="accordion">

              <li class="ql_sbmt">

                  <div class="link"><span class="iconfont icon-jiantouxia"></span> 诊所管理</div>

                  <ul class="submenu">

                      <li class="ql_sed">
                          <a href="#"> <span class="iconfont icon-wxbzhuye"></span>诊所信息</a>
                      </li>

                      <li class="ql_sed">
                          <a href="#"><span class="iconfont icon-wodedamaijihuo">医生信息</a>
                      </li>
                  </ul>

              </li>

              <li>

                  <div class="link"><span class="iconfont icon-jiantouxia"></span> 保单管理</div>

                  <ul class="submenu">

                      <li class="ql_sed" >
                          <a href="#"><span class="iconfont icon-wxbzhanghu"></span>对账管理</a>
                      </li>

                      <li class="ql_sed">
                          <a href="#"><span class="iconfont icon-xiaofeimingxidan"></span>历史保单查询</a>
                      </li>

                  </ul>

              </li>

          </ul>
              <!--诊所信息-->
              <div class="ql_mos" style="display: block">
                  <div class="H-box">
                      <div  class="H-ret">
                          <p> < 返回 诊所管理 <span> 诊所信息 </span></p>
                      </div>
                      <div class="H-shuju">
                          诊所名称：<input type="text" id="filterName" name="filterName" placeholder="请输入诊所名称"/>
                          诊所地址：<input type="text" placeholder="请输入诊所地址"/>
                          入住时间 <input type="date" class="H-input1"/>至 <input type="date" class="H-input1">
                          <input type="button" class="H-cx" style="color: white" value="查询" />
                      </div>
                      <button class="H-XZYY" style="color: white">+新增医院</button>
                      <table class="H-tab" border="1" cellpadding="0" cellspacing="0">
                          <tr style="height:40px">
                              <td>序号</td>
                              <td>诊所名称</td>
                              <td>诊所地址</td>
                              <td>联系电话</td>
                              <td>营业时间</td>
                              <td>操作</td>
                          </tr>
                          <tr>
                              <td>1</td>
                              <td>康贝佳牙科诊所</td>
                              <td>北京市东城区东四北大街166号</td>
                              <td>010-23452234</td>
                              <td>8：00-20:00</td>
                              <td> <span>修改</span> <span class="H-DEL" onclick="del(this)">删除</span></td>
                          </tr>
                          <tr>
                              <td>2</td>
                              <td>康贝佳牙科诊所</td>
                              <td>北京市东城区东四北大街166号</td>
                              <td>010-23452234</td>
                              <td>8：00-20:00</td>
                              <td> <span>修改</span> <span class="H-DEL" onclick="del(this)">删除</span></td>
                          </tr>
                          <tr>
                              <td>3</td>
                              <td>康贝佳牙科诊所</td>
                              <td>北京市东城区东四北大街166号</td>
                              <td>010-23452234</td>
                              <td>8：00-20:00</td>
                              <td> <span>修改</span> <span class="H-DEL" onclick="del(this)">删除</span></td>
                          </tr>
                      </table>
                  </div>
                  <div class="clm" style="display: none">
                      <div class="box">
                          <span class="q1"><a href="index.html">   <&nbsp;</a></span>
                          <span class="q3"><a href="index.html">返回</a></span>
                          <span class="q2">诊所管理-><a href="#">诊所信息</a></span>
                      </div>
                      <div class="box1">
                          <div class="c1">
                              <span class="span1">诊所名称:</span>
                              <input type="text" class="inp1" placeholder="请输入诊所名称" id="zs1">
                          </div>
                          <div class="c2">
                              <span class="span1">诊所地址:</span>
                              <input type="text" class="inp2" placeholder="请输入诊所地址" id="zs2">
                          </div>
                          <div class="c3">
                              <span class="span1">任职真挫:</span>
                              <input type="text" class="inp2" placeholder="请输入诊所名称" id="zs3">
                          </div>

                          <div class="c3">
                              <span class="span1">联系电话:</span>
                              <input type="text" class="inp2" placeholder="请输入联系号码"  id="zs4">
                          </div>
                          <div class="c3">
                              <span class="span1">选择日期:</span>
                              <input type="date" class="inp2"  id="zs5">
                          </div>

                          <div class="c4">
                              <div class="c4_1">
                                  <span class="span1">诊所地点:</span>
                              </div>

                              <textarea id="text" maxlength="10" placeholder="请准确填写诊所特色信息，包括服务项目，有助于患包括服务项目，有助于患者更好的了解诊所，并进行就诊治疗"></textarea>

                              <p class="p1">您还可以输入<span id="sp"></span>个字</p>
                          </div>

                          <div class="c5">
                              <span class="span1">添加照片:</span>
                              <input type="file" id="photo">
                              <div class="container"></div>
                          </div>


                      </div>
                      <div class="box4" id="tj">
                        <a href="index.html">提交</a>
                      </div>

                  </div>
              </div>
              <!--医生信息-->
              <div class="ql_mos">
                  <div class="l-ybox">
                      <div class="l-her" >
                          <span>医生姓名:</span> <input type="text" placeholder="请输入医生姓名" id="filter" name="filter"/>
                          <span>医生职称:</span> <input type="text" placeholder="请输入医生职称"/>
                          <span>就职诊所:</span> <input type="text" placeholder="请输入就职诊所"/>
                          <button class="l_cha">查询</button>
                      </div>
                      <button class="l-xz">+新增医生</button>
                      <table class="l-table" border="1" cellspacing="" cellpadding="">
                          <tr class="l-tr1">
                              <td>1</td> <td>医生照片</td> <td>医生名字</td> <td>任职诊所</td> <td>医生职称</td> <td>医生擅长</td> <td>操作</td>
                          </tr>
                          <tr>
                              <td>1</td> <td><img src="img/lld.png"/></td> <td>勒东</td> <td>康贝佳牙科诊所</td> <td>副主任医师</td> <td>口腔颌面外科，擅长阻生齿、颌面部感染、创伤、肿瘤和胰腺疾病的诊治和治疗，以及缺失牙齿种植治疗。擅长颌面部感染、创伤、肿瘤...</td> <td><span class="l-span1">修改</span><span class="l-span2">删除</span></td>
                          </tr>
                          <tr>
                              <td>1</td> <td><img src="img/lld.png"/></td> <td>勒西</td> <td>康贝佳牙科诊所</td> <td>副主任医师</td> <td>口腔颌面外科，擅长阻生齿、颌面部感染、创伤、肿瘤和胰腺疾病的诊治和治疗，以及缺失牙齿种植治疗。擅长颌面部感染、创伤、肿瘤...</td> <td><span class="l-span1">修改</span><span class="l-span2">删除</span></td>
                          </tr>
                      </table>
                  </div>
                  <div class="clm1" style="display: none">
                      <div class="box">
                          <span class="q1"><a href="index.html">   <&nbsp;</a></span>
                          <span class="q3"><a href="index.html">返回</a></span>
                          <span class="q2">诊所管理-><a href="#">医生信息</a></span>
                      </div>
                      <div class="box1">
                          <div class="c1">
                              <span class="span1">医生姓名:</span>
                              <input type="text" class="inp1" placeholder="请输入医生名字">
                          </div>
                          <div class="c2">
                              <span class="span1">医生职称:</span>
                              <input type="text" class="inp2" placeholder="请输入医生职称">
                          </div>
                          <div class="c3">
                              <span class="span1">任职诊所:</span>
                              <input type="text" class="inp2" placeholder="请输入医生名称">
                          </div>
                          <div class="c4">
                              <div class="c4_1">
                                  <span class="span1">医生擅长:</span>
                              </div>

                              <textarea id="text" maxlength="10" placeholder="请准确填写诊所特色信息，包括服务项目，有助于患包括服务项目，有助于患者更好的了解诊所，并进行就诊治疗"></textarea>

                              <p class="p1">您还可以输入<span id="sp"></span>个字</p>
                          </div>

                          <div class="c5">
                              <span class="span1">添加照片:</span>
                              <input type="file" id="photo">
                              <div class="container"></div>
                          </div>


                      </div>
                      <div class="box4">
                提交          
                      </div>

                  </div>
              </div>
              <div class="ql_mos">
                  <div class="lxl">
                      <div  class="x_guan">
                          <div class="x_tou"> <div class="x_fa"><  返回      保单管理 --></div>&nbsp; <p>对账管理</p></div>
                          <div class="x_shang">
                              <p>保单号:</p><input type="text" placeholder="请输入保单号查询" id="filterNam" name="filterName"/>  <div class="x_lan">查询</div>
                          </div>
                          <table border="1" width="986px"  style="text-align: center;border-collapse:collapse;" cellpadding="0" cellspacing="0">
                              <tr height="40px">
                                  <td>时间</td>
                                  <td>保单号</td>
                                  <td>投保人</td>
                                  <td>投保人身份证</td>
                                  <td>被投保人</td>
                                  <td>就诊诊所</td>
                                  <td colspan="2">操作</td>

                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>364896124</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>l勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                              <tr>
                                  <td>2017-05-11   12:00</td>
                                  <td>4654456454</td>
                                  <td>勒东</td>
                                  <td>2356565656565</td>
                                  <td>勒星</td>
                                  <td>康贝佳牙科诊所</td>
                                  <td colspan="2"> <a href="#">修改</a> <div class="x_cha">查看详情></div>    </td>
                              </tr>
                          </table>

                      </div>
                      <div class="x_mo">
                          <div class="x_bao">
                              <div class="x_xi">报单详情</div> <div class="x_cuo">x</div>
                          </div>
                          <div class="x_liu">
                              <div class="x_kang">
                                  <p>流水号  : 123344565</p>
                                  <p>患者名称 :勒星</p>
                                  <p>康贝佳牙科诊所</p>
                              </div>
                              <div class="x_kang">
                                  <p>报单编号 ：466544852</p>
                                  <p> 患者身份证号：23555664455545</p>
                              </div>
                          </div>
                          <table border="1" width="620px" height="40px" style="text-align: center;margin-left: 15px;" cellpadding="0" cellspacing="0">
                              <tr height="40px">
                                  <td>项目名称</td>
                                  <td>项目折扣</td>
                                  <td>本次使用额度</td>
                                  <td>剩余可用额度</td>
                              </tr>
                              <tr height="40px">
                                  <td>口腔管理</td>
                                  <td></td>
                                  <td>1次</td>
                                  <td>0次</td>
                              </tr>
                              <tr height="40px">
                                  <td>洗牙</td>
                                  <td></td>
                                  <td>1次</td>
                                  <td>0次</td>
                              </tr>
                              <tr height="40px">
                                  <td>窝沟封闭</td>
                                  <td></td>
                                  <td>1次</td>
                                  <td>2颗</td>
                              </tr>
                              <tr height="40px">
                                  <td>根管治疗</td>
                                  <td></td>
                                  <td>1次</td>
                                  <td>￥350</td>
                              </tr>
                          </table>
                          <div class="x_jz">
                              <div class="x_a">
                                  就诊日期 :  2017-05-11    12:00
                              </div>
                              <div class="x_a1">
                                  应付金额 :￥800  实付金额:  ￥0
                              </div>
                          </div>
                      </div>
                      <div class="Popup-backdrop" ></div>
                  </div>
              </div>
              <div class="ql_mos">
                  <div  class="x_guan">
                      <div class="x_shang">
                          <p>保单号:</p><input type="text" placeholder="请输入保单号查询" id="moseet" name="filter" />
                          <div class="q_lan">查询</div>
                      </div>
                      <table border="1" width="986px"  style="text-align: center;" cellpadding="0" cellspacing="0">
                          <tr height="40px">
                              <td>时间</td>
                              <td>保单号</td>
                              <td>投保人</td>
                              <td>投保人身份证</td>
                              <td>被投保人</td>
                              <td>就诊诊所</td>
                              <td>状态</td>

                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>46544566544</td>
                              <td>勒东</td>
                              <td>2356565656565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >待审批 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4634566754</td>
                              <td>勒东</td>
                              <td>2356565656565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >待审批 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>46982355454</td>
                              <td>勒东</td>
                              <td>2356565656565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >待审批 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4654123454</td>
                              <td>勒东</td>
                              <td>2356565656565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >待审批 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>46545553456</td>
                              <td>勒东</td>
                              <td>2356565656565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >已赔付 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4654459890</td>
                              <td>l勒东</td>
                              <td>2356565656565</td>
                              <td>勒王</td>
                              <td>康贝佳牙科诊所</td>
                              <td >已赔付 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4654456454</td>
                              <td>勒东</td>
                              <td>2356544456565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >已赔付 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4654456454</td>
                              <td>勒东</td>
                              <td>2356534856565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >已赔付 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4654456454</td>
                              <td>勒东</td>
                              <td>2356586856565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >已赔付 </td>
                          </tr>
                          <tr>
                              <td>2017-05-11   12:00</td>
                              <td>4654456454</td>
                              <td>勒东</td>
                              <td>235639056565</td>
                              <td>勒星</td>
                              <td>康贝佳牙科诊所</td>
                              <td >已赔付 </td>
                          </tr>
                      </table>

                  </div>

              </div>
          </div>

      </div>
<script>
    $tab = $(".H-tab");
    $tr = $("tr");
    $td = $("td");
    $(".box4").click(function(){
        alert($(".inp1").val());
       window.localStorage.name = $(".inp1").val();
        console.log()
        $otr = $("<tr></tr>")
        $otd1 = $("<td>"+window.localStorage.name+"</td>");
        $otd2 = $("<td></td>")
        $otd3 = $("<td></td>")
        $otd4 = $("<td></td>")
        $otd5 = $("<td></td>")
        $otd6 = $("<td></td>")
        $otr.append($otd1)
        $tab.append($otr)
    });









    $('.link').click(function() {
        $(this).stop().next().slideToggle();
    })
    var oli=document.querySelectorAll(".ql_sed");
    var op=document.querySelectorAll(".ql_mos");
    for(var i=0;i<oli.length;i++){
        oli[i].index=i;
        oli[i].onclick=function(){
            for(var i=0;i<oli.length;i++) {
                // oli[i].className = ""
                op[i].style.display = "none"
            }
            op[this.index].style.display="block"
        }
    }
</script>
      <script>



          //<!--添加图片-->
          document.getElementById("photo").addEventListener("change",function(e){
              var files =this.files;
              var img = new Image();
              var reader =new FileReader();
              reader.readAsDataURL(files[0]);
              reader.onload =function(e){
                  var dx =(e.total/1024)/1024;
                  if(dx>=2){
                      alert("文件大小大于2M");
                      return;
                  }
                  img.src =this.result;
                  img.style.width ="10%";
                  img.style.height ="10%";
                  document.querySelector('.container').appendChild(img);
              }
          })
          //textarea 文本输入框
          window.onload = function(){
              // 获取元素
              var sp = document.getElementById('sp');
              var text = document.getElementById('text');
              var aaa = 10;//创建一个变量
              sp.innerHTML = aaa;//设置span的内容
              // 给多行文本框添加键盘按下事件
              text.onkeydown = function(e){
                  // 判断键码是否为删除键
                  if(e.keyCode ==10){
                      // 点击删除数字++
                      sp.innerHTML = aaa;
                      aaa++;
                      // 限制字数
                    
                      return;
                  }else{
                  	 sp.innerHTML = aaa;
                      aaa--;
                  
                  }
                  // 如果按下的不是删除键,则字数限制--;
              
                 
              }

          }

          $(function() {
              $('.q_lan').on('click', function() {
                  // console.log($('#filterName').val());
                  $('table tr').hide()
                      .filter(":contains('" + ($('#moseet').val()) + "')")
                      .show();
              })
          })

          $(".H-XZYY").click(function () {
              $(".clm").css("display","block")
              $(".H-box").css("display","none")
          })

          $(".l-xz").click(function () {
              $(".clm1").css("display","block");
              $(".l-ybox").css("display","none")

          });

          //获取元素
          // var ozs1 = document.getElementById("zs1");
          // var ozs2 = document.getElementById("zs2");
          // var ozs3 = document.getElementById("zs3");
          // var ozs4 = document.getElementById("zs4");
          // var ozs5 = document.getElementById("zs5");
          // var obtn = document.getElementById("tj");
          // var otab = document.getElementsByClassName("H-tab");

          // console.log(ozs4);
          // console.log(ozs5);
          // console.log(obtn);
          // console.log(otab);

//           obtn.onclick=function () {
//               //获取输入框内容
//               var a = ozs1.value;
//               var b = ozs2.value;
//               var c = ozs3.value;
//               var d = ozs4.value;
//               var e = ozs5.value;
//               //创建单元格
//               var otd1 = document.createElement("td");
//               otd1.className = "tds";
//               var otd2 = document.createElement("td");
//               var otd3 = document.createElement("td");
//               var otd4 = document.createElement("td");
//               var otd5 = document.createElement("td");
//
//               var otds=document.getElementsByClassName("tds")
//               //把输入框内容给每一个td   一一对应
//               otds.innerHTML = a;
//               otd2.innerHTML = b;
//               otd3.innerHTML = c;
//               otd4.innerHTML = d;
//               otd5.innerHTML = "new Date().toLocaleString()";
//               //把td放入tr中
//               //创建tr
//               var otr = document.createElement("tr");
//               console.log(otr)
//               //给tr加一个类名，方便获取
//               otr.className = "trs";
//               //把5个td依次放入tr中
//               otr.appendChild(otd1);
//               otr.appendChild(otd2);
//               otr.appendChild(otd3);
//               otr.appendChild(otd4);
//               otr.appendChild(otd5);
// // console.log(otr)
//               //把tr放入table中
//               otab.appendChild(otr);
//
//
//           }


      </script>
      <script>
          $(".H-DEL").click(function(){
              $(this).parent().parent().remove();

          })
          $(function() {
              $('.H-cx').on('click', function() {
                  // console.log($('#filterName').val());
                  $('table tr').hide()
                      .filter(":contains('" + ($('#filterName').val()) + "')")
                      .show();
              })
          })


      </script>
      <script>
          $('tr:odd').css('background','#F5F5F5')
          $('.x_cha').click(function(){
              $('.x_mo').show()

              $('.Popup-backdrop').show();


          })
          $('.x_cuo').click(function(){
              $('.x_mo').hide()
              $('.Popup-backdrop').hide();
          })

          $(function() {
              $('.x_lan').on('click', function() {

                  $('table tr').hide()
                      .filter(":contains('" + ($('#filterNam').val()) + "')")
                      .show();
              })
          });
      </script>
      <script>

          $(".l-span2").click(function(){
              $(this).parent().parent().remove();


          })
          $(function() {
              $('.l_cha').on('click', function() {
                  // console.log($('#filterName').val());
                  $('table tr').hide()
                      .filter(":contains('" + ($('#filter').val()) + "')")
                      .show();
              })
          })




      </script>
</body>
</html>